function laohuji(sel) {
	this.domsu = document.querySelector(sel);
	this.sz1 = document.querySelectorAll(sel + " .laohuji div")[0];
	this.sz2 = document.querySelectorAll(sel + " .laohuji div")[1];
	this.sz3 = document.querySelectorAll(sel + " .laohuji div")[2];
	this.init();
}
laohuji.prototype.init = function() {
	var boxRect = this.domsu.querySelector(".laohuji").getBoundingClientRect();
	console.log(boxRect)
	this.h = boxRect.height;
	console.log(this.h);
	
	this.bgsize = "background-size: 100% " + this.h * 10 + "px;";
}
laohuji.prototype.quadEaseInOut = function(t, b, c, d) {
	if((t /= d / 2) < 1) return c / 2 * t * t + b;
	return -c / 2 * ((--t) * (t - 2) - 1) + b;
}
laohuji.prototype.start = function(gw, sw, bw) {
	var self = this;
	var w = this.h;
	this.sz1.setAttribute("style", "background-position-y:0px;")
	this.sz2.setAttribute("style", "background-position-y:0px;")
	this.sz3.setAttribute("style", "background-position-y:0px;")
	var t1 = 0,
		b1 = 0,
		c1 = w * 20 + (gw + 1) * w,
		d1 = 200;

	var t2 = 0,
		b2 = 0,
		c2 = w * 20 + (sw + 1) * w,
		d2 = 300;

	var t3 = 0,
		b3 = 0,
		c3 = w * 20 + (bw + 1) * w,
		d3 = 400;

	var seti = setInterval(function() {
		var r1 = self.quadEaseInOut(t1, b1, c1, d1);
		var r2 = self.quadEaseInOut(t2, b2, c2, d2);
		var r3 = self.quadEaseInOut(t3, b3, c3, d3);

		if(t1 <= d1) {
			t1++;
		}
		if(t2 <= d2) {
			t2++;
		}
		if(t3 <= d3) {
			t3++;
		}
		self.sz1.setAttribute("style", self.bgsize + "background-position-y:" + r1 + "px;")
		self.sz2.setAttribute("style", self.bgsize + "background-position-y:" + r2 + "px;")
		self.sz3.setAttribute("style", self.bgsize + "background-position-y:" + r3 + "px;")

		if(t1 > d1 && t2 > d2 && t3 > d3) {
			clearInterval(seti);
		}
	}, 1000 / 60);
}